<template>
  <div>
    <el-card class="box-card">
      <div v-for="o in 1" :key="o" class="text item" style="background-color: black; color: white;">

        <el-row :gutter="20">
          <el-col :span="6"><div class="grid-content bg-purple">
            <span>关于我们</span>
            <el-divider></el-divider>
            <span>资格证书</span>
            <el-divider></el-divider>
            <span>联系我们</span>
            <el-divider></el-divider>
            <span>帮助</span>
          </div></el-col>
          <el-col :span="6"><div class="grid-content bg-purple">

            <el-collapse>
              <el-collapse-item title="公司地址" name="1">
                <div>西安市雁塔区唐兴数码</div>
              </el-collapse-item>

              <el-collapse-item title="联系电话" name="2">
                <div>8208208820</div>
              </el-collapse-item>
            </el-collapse>
          </div></el-col>
          <el-col :span="6"><div class="grid-content bg-purple">
            <!--<span style="width: auto">联系我们</span>-->
            <!--<div class="demo-image">-->
              <!--<div class="block" v-for="fit in fits" :key="fit">-->
                <!--&lt;!&ndash;<span class="demonstration">{{ fit }}</span>&ndash;&gt;-->
                <!--<el-image-->
                  <!--style="width: 200px; height: 200px"-->
                  <!--:src="url"-->
                  <!--:fit="fit"></el-image>-->
              <!--</div>-->
            <!--</div>-->
          </div></el-col>
          <el-col :span="6"><div class="grid-content bg-purple">

            <span style="width: auto">联系我们</span>
            <div class="demo-image">
              <div class="block" v-for="fit in fits" :key="fit">
                <!--<span class="demonstration">{{ fit }}</span>-->

                <el-image
                  style="width: 200px; height: 200px"
                  :src="url"
                  :fit="fit"></el-image>

              </div>
            </div>
          </div></el-col>
        </el-row>
        <!--版权条-->
        <div v-for="o in 1" :key="o" class="text item" style="background-color: black; color: white;">
          <div >
            <el-divider></el-divider>
            <span>Copyright © 2011~2023 onLineStudy(西安)科技有限公司. All Rights Reserved. 安ICP备10086111号-1</span>
          </div>
      </div>


      </div>
    </el-card>
  </div>
</template>

<script>
  export default {
    name: "bottomPage",
    data() {
      return {
        fits: ['fill'],
        url: 'http://rwuqscd8h.bkt.clouddn.com/lgd.jpg'
      }
    }
  }
</script>

<style scoped>
  .text {
    font-size: 20px;
  }

  .item {
    padding: 18px 0;
  }

  .box-card {
    width: 1500px;
  }

  .el-row {
    margin-bottom: 20px;
  }
  .el-col {
    border-radius: 4px;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }

</style>
